<template>
  <div>

    <div class="quote">
      <div class="quoteTop">

        <h4 class="panel-heading">查询条件</h4>

        <div class="query">

          <Row>

            <Col span="6">
            <label>级别名称</label>
            <Input size="small" style="width: 50%" v-model="queryObj.levelName"> </Input>
            </Col>

            <Col span="6">
            <label>状态</label>
            <Select size="small" style="width: 50%" v-model="queryObj.state">
              <Option v-for="(item,index) in commonstate" v-text="item" v-bind:value="index"></Option>
            </Select>
            </Col>

            <Col span="6">
            <Button size="small" @click="query" type="primary">查 询</Button>
            <Button size="small" @click="reset" type="error">重 置</Button>
            <Button size="small" @click="newLevel" type="success">新 建</Button>
            </Col>

          </Row>

        </div>

      </div>

      <div>

      </div>
    </div>

    <div class="quote">
      <div class="quoteCenten">
        <table cellspacing="0">
          <thead>
          <tr>
            <th>No.</th>
            <th>级别名称</th>
            <th>最高级别</th>
            <th>上级级别</th>
            <th>营业部</th>
            <th>状态</th>
            <th>创建人</th>
            <th>创建时间</th>
            <th>更新人</th>
            <th>更新时间</th>
            <th>操作</th>
          </tr>

          </thead>
          <tbody>
          <tr v-for="(item,index) in items">
            <td v-text="index+1"></td>
            <td v-text="item.levelName"></td>
            <td v-text="item.masterLevelName"></td>
            <td v-text="item.parentLevelName"></td>
            <td v-text="item.partnerName"></td>
            <td v-text="item.stateName"></td>
            <td v-text="item.createBy"></td>
            <td v-text="item.createTime"></td>
            <td v-text="item.updateBy"></td>
            <td v-text="item.updateTime"></td>
            <td>
              <a href="javascript:void(0)" @click="deleteSaler(item.id)" class="team">删除</a>
              <a href="javascript:void(0)" @click="editLevel(item.id, item.levelName)">
                编辑
              </a>
            </td>
          </tr>
          </tbody>
        </table>

      </div>
    </div>

    <div class="quote">
      <div class="quoteB">
        <div class="page">
          <Page style="margin: 0 auto" :total="pageTotal" :current="pageNumber" @on-change="cutPage"
                @on-page-size-change="cutSize" show-elevator show-total show-sizer></Page>
        </div>
      </div>
    </div>
  </div>
</template>

<script type="text/javascript">
  import api from '../../utils/api.js';
  import commonCode from '../../assets/json/common_code.json';
  export default {
    name: "saleManage",
    data: function () {
      return {
        pageSize: 10,
        pageNumber: 1,
        pageTotal: '',

        queryObj: {
          state: '',
          levelName: '',
          partnerId: JSON.parse(localStorage.Manage).USER_PARTNER_PRIVILEGE.id,
        },

        commonstate: commonCode.commonState,

        items: [],

        levelDir: [],
      }
    },
    created: function () {
      this.pageSize = 10;
      this.pageNumber = 1;
      this.getDir();
    },
    methods: {
      query: function () {
        this.pageSize = 10;
        this.pageNumber = 1;
        this.getDir();
      },

      getDir: function () {

        var self = this;

        api.getSalemanLevelDir(this.queryObj.partnerId, this.queryObj.state).then(res => {
          self.levelDir = res.body.data;

          self.getSalemanLevel();
        })
      },

      getSalemanLevel: function () {

        var self = this;

        api.getSalemanLevelPageQuery(this.pageSize, this.pageNumber, this.queryObj).then((res) => {

          var data = res.body.data;

          console.log(data);

          this.pageTotal = data.total;
          this.currentStart = (data.pageNumber - 1) * data.pageSize + 1;
          this.currentEnd = data.pageNumber * data.pageSize > data.total ? data.total : data.pageNumber * data.pageSize;

          data.rows.forEach(function (item) {

            item.partnerName = JSON.parse(localStorage.Manage).USER_PARTNER_PRIVILEGE.partnerName;
            item.stateName = self.commonstate[item.state];

            self.levelDir.forEach(function (levelItem) {
              if (levelItem.id === item.masterLevel) {
                item.masterLevelName = levelItem.levelName;
              }

              if (levelItem.id === item.parentLevel) {
                item.parentLevelName = levelItem.levelName;
              }
            })

          });

          self.items = data.rows;

        })
      },

      reset: function () {
        this.queryObj = {
          levelName: "",
          state: "",
          partnerId: JSON.parse(localStorage.Manage).USER_PARTNER_PRIVILEGE.id,
        };
      },

      cutPage: function (pageNumber) {
        this.pageNumber = pageNumber;

        this.getDir();
      },

      cutSize: function (pageSize) {
        this.pageSize = pageSize;

        this.getDir();
      },

      deleteSaler: function deleteSaler(id) {

        if (confirm("确定删除该级别么？")) {
          api.deleteSaleLevel(id).then(res => {

            alert(res.body.message.info);
            this.getDir();
          })
        }


      },

      editLevel: function editLevel(id, levelName) {

        this.$router.push("buildLevel/" + id + "/" + levelName);

      },

      newLevel: function () {

        this.$router.push('/buildLevel/-1/empty');

      },

    },
  }
</script>
